<strong></strong><template>
	<view class="content mainpadding" style="padding-bottom: 120rpx;">
		<u-navbar safeAreaInsetTop placeholder fixed>
			<view class="u-nav-slot" slot="left" @click="goBack">
				<u-icon name="arrow-left" size="19"></u-icon>
				<!-- <u-line direction="column" :hairline="false" length="16" margin="0 8px"></u-line> -->
				<!-- <u-icon name="home" size="20"></u-icon> -->				
			</view>
			<view class="u-nav-slot color_ling text_weight" slot="center">
				意見反饋
			</view>
			<view class="u-nav-slot text_a color_san" slot="right" @click="goHistoryFeedBack">
				歷史反饋
			</view>
		</u-navbar>
		<view class="ffffff border mainpadding">
			<textarea cols="30" rows="10" placeholder="請輸入您要反饋的問題(5-500字以内)"
				placeholder-style="font-size: 28rpx;font-weight: 500;color: #666666;" class="text_a" v-model="content"></textarea>
		</view>
		<view class="margin_top ffffff border mainpadding">
			<view class="color_six text_a">
				請提供問題的截圖或照片（選填）
			</view>
			<view class="flexleft flex_wrap">
				<view class="item_image_box margin_top" v-for="(item,index) in images_arr" :key="index">
					<view class="item_image radius">
						<image :src="item" mode=""></image>
						<view class="deleteimg" @click="deleimage(index,images_arr)"></view>
					</view>
				</view>
				<!-- 图片盒子 -->
				<view class="item_image_box margin_top" @click="uploadImg(images,images_arr,3)" v-if="images_arr.length<3">
					<view class="item_image radius">
						<image src="@/static/image/system/upimg.png" mode=""></image>
					</view>
				</view>
			</view>
		</view>
		<view class="margin_top border mainpadding ffffff flexbetween">
			<view class="color_san text_a margin_right6">
				聯係方式
			</view>
			<input class="text_a flex1 textright" type="text" placeholder="請輸入手機號"
				placeholder-style="font-size: 30rpx;font-weight: 500;color: #999999;" v-model="phone">
		</view>
		<!-- 底部 -->
		<view class="footer">
			<view class="footerButton" @click="submit">
				提交
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				images: [], //传给後端的图片
				images_arr: [], //展示的图片
				content:"",//内容
				phone:"",//手机号
			}
		},
		methods: {
			async submit(){ //提交
				let _this=this
				if (this.mobile&&!this.mobile.match(/^1\d{10}$/)) {
					this.http.toast("請輸入正確的手機號！")
					return false
				}
				let res = await this.http.request('/api/member/addBack', 'POST', {
					content:_this.content,
					phone: _this.phone,
					images: _this.images.join(),
				})
				if (res.code == 1) {
					this.http.toast("提交成功")
					setTimeout(()=>{
						uni.navigateBack(1)
					},500)
				} else if (res.code == 0) {
					this.http.toast(res.msg)
				} else {
					this.http.toast('系統處理中，請稍後再試');
				}
			},
			deleimage(i, upimg) { //刪除图片
				upimg.splice(i, 1)
				this.images.splice(i,1)
			},
			goBack(){
				uni.navigateBack(1)
			},
			goHistoryFeedBack(){ //历史反饋
				uni.navigateTo({
					url:"./lishifk"
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.item_image_box {
		width: 33.33%;
	}

	.item_image {
		position: relative;
		width: 180rpx;
		height: 180rpx;

		image {
			width: 100%;
			height: 100%;
		}
	}
</style>